import * as React from 'react'
import classNames from 'classnames'
import './style/index.less'
import { ButtonProps, ButtonState } from './interface'

export default class Button extends React.Component<ButtonProps, ButtonState> {
  static defaultProps = {
    prefixCls: 'layui-btn'
  }
  constructor(props: ButtonProps) {
    super(props);
    this.state = {

    }
  }

  render() {

    const {
      prefixCls,
      className,
      type,
      size,
      onClick,
      fluid, // 是否为流体按钮
      ...restProps
    } = this.props


    let sizeCls = ''
    switch (size) {
      case 'large':
      case 'lg':
        sizeCls = 'lg'
        break;
      case 'small':
      case 'sm':
        sizeCls = 'sm'
        break;
      case 'mini':
      case 'xs':
        sizeCls = 'xs'
      default:
        break;
    }
    // 计算classname
    const classes = classNames(prefixCls, className, {
      [`${prefixCls}-${type}`]: type,
      [`${prefixCls}-${sizeCls}`]: sizeCls,
      [`${prefixCls}-fluid`]: fluid,
    })
    return (
      <button
        className={classes}
        onClick={onClick}
        type="button"
        {...restProps}
      ></button>
    )
  }
}